﻿<%@ Page MasterPageFile="~/Site.Master" Language="C#" AutoEventWireup="true" CodeBehind="ShopRegister.aspx.cs" Inherits="RabbitManage.UI.ShopRegister" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    
    <form id="form1" action="/Action/ShopRegister.aspx" method="POST">
        <hgroup class="title">
            <h2>User Register</h2>
        </hgroup>
    
    <script type="text/javascript">

        form1.onsubmit = function (e) {
            // stop the regular form submission
            e.preventDefault();

            // collect the form data while iterating over the inputs
            var data = {};
            for (var i = 0, ii = form1.length; i < ii; ++i) {
                var input = form1[i];
                if (input.name) {
                    data[input.name] = input.value;
                }
            }

            // construct an HTTP request
            var xhr = new XMLHttpRequest();
            xhr.open(form1.method, form1.action, true);
            xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');

            // send the collected data as JSON
            xhr.send(JSON.stringify(data));

            xhr.onloadend = function () {
                // done
                if (xhr.responseText == "true") {
                    window.location = "ShopDetail.aspx";
                } else {
                    alert(xhr.responseText);
                }
            };
        };

        var namePass = true;
        var cellPass = true;
        var mailPass = true;

        function nameValidate() {
            var element = document.getElementById("inputName");
            var xhr = new XMLHttpRequest();
            xhr.open("post", "/Action/ShopRegisterValidate.aspx?Name=" + element.value, true);
            xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
            xhr.send();
            document.getElementById("nameValidator").innerHTML = "<img src='/Share/Images/wait.gif' width=20 />";

            xhr.onloadend = function () {
                // done
                if (xhr.responseText == "true") {
                    document.getElementById("nameValidator").style.color = "green";
                    document.getElementById("nameValidator").innerHTML = "√";
                    namePass = true;
                } else {
                    document.getElementById("nameValidator").style.color = "red";
                    document.getElementById("nameValidator").innerHTML = "×";
                    namePass = false;
                }
            };

        }

        function cellPhoneValidate() {
            var element = document.getElementById("inputCellPhone");
            var xhr = new XMLHttpRequest();
            xhr.open("post", "/Action/ShopRegisterValidate.aspx?CellPhone=" + element.value, true);
            xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
            xhr.send();
            document.getElementById("cellValidator").innerHTML = "<img src='/Share/Images/wait.gif' width=20  />";

            xhr.onloadend = function () {
                // done
                if (xhr.responseText == "true") {
                    document.getElementById("cellValidator").style.color = "green";
                    document.getElementById("cellValidator").innerHTML = "√";
                    cellPass = true;
                } else {
                    document.getElementById("cellValidator").style.color = "red";
                    document.getElementById("cellValidator").innerHTML = "×";
                    cellPass = false;
                }
            };

        }

        function mailValidate() {
            var element = document.getElementById("inputMail");
            var xhr = new XMLHttpRequest();
            xhr.open("post", "/Action/ShopRegisterValidate.aspx?Mail=" + element.value, true);
            xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
            xhr.send();
            document.getElementById("mailValidator").innerHTML = "<img src='/Share/Images/wait.gif' width=20  />";

            xhr.onloadend = function () {
                // done
                if (xhr.responseText == "true") {
                    document.getElementById("mailValidator").style.color = "green";
                    document.getElementById("mailValidator").innerHTML = "√";
                    mailPass = true;
                } else {
                    document.getElementById("mailValidator").style.color = "red";
                    document.getElementById("mailValidator").innerHTML = "×";
                    mailPass = false;
                }
            };

        }

        function validate() {
            var pass = namePass && cellPass && mailPass;
            return pass;
        }
    </script>
        
        商家注册
    <table>
        <tr>
            <td>登陆名称:</td>
            <td>
                <input type="text" id="inputName" name="Name" onblur="nameValidate();" />
            </td>
            <td id="nameValidator"></td>
        </tr>
        
        <tr>
            <td>手机:</td>
            <td>
                <input type="text" id="inputCellPhone" name="CellPhone" onblur="cellPhoneValidate();"/>
            </td>
            <td id="cellValidator"></td>
        </tr>
        
        <tr>
            <td>密码:</td>
            <td>
                <input type="password" id="inputPassword" name="Password"/>
            </td>
        </tr>
        
<%--        <tr>
            <td>Repeat Password:</td>
            <td>
                <input type="password" id="inputPassword2" name="Password2"/>
            </td>
        </tr>--%>

        <tr>
            <td>邮箱:</td>
            <td>
                <input type="text" id="inputMail" name="Mail" onblur="mailValidate();"/>
            </td>
            <td id="mailValidator"></td>
        </tr>

    </table>
    
        <input type="submit" value="注册" onclick="return validate();" />

    </form>


</asp:Content>
